import Vue from "vue";
import Vuex from 'vuex';
import getBanner from "../api/getData";
import getLeftAside from '../api/getLeftAside';
import setTitle from '../utils/siteTitlle'
import getAbout from '../api/getAbout'
import getProject from '../api/getProject'
import getMessage from '../api/getMessage'
if(!window.Vuex){
    Vue.use(Vuex);

}
/**
 * 简写newVuex */
const store = new Vuex.Store({
    modules: {
        banners: {
            // 模块化必须使用nameSpaced
            namespaced: true,
            state: {
                loading: false,
                data: [],
            },
            mutations: {
                setLoading(state, payload) {
                    state.loading = payload;
                },
                setData(state, payload) {
                    state.data = payload;
                }
            },
            actions: {
                async getBanners(ctx) {
                    // 有数据了不需要在请求数据
                    if (ctx.state.data.length) {
                        return;
                    }
                    ctx.commit('setLoading', true);
                    const resp = await getBanner();
                    ctx.commit('setData', resp);
                    ctx.commit('setLoading', false);
                }
            }
        },
        leftAside: {
            namespaced: true,
            state: {
                data: null,
            },
            mutations: {
                setData(state, payload) {
                    state.data = payload;
                }
            },
            actions: {
                async getLeftAside(ctx) {
                    const resp = await getLeftAside();
                    ctx.commit('setData', resp);
                    // 定义地址栏小图标
                    if (resp.favicon) {
                        let link = document.querySelector("link[rel='shortcut icon']")
                        if (link) {
                            return;
                        }
                        link = document.createElement('link');
                        link.rel = 'shortcut icon';
                        link.type = 'images/x-icon';
                        link.href = resp.favicon;
                        document.querySelector('head').appendChild(link);
                    };
                    // 网站标题依托于仓库
                    if (resp.siteTitle) {
                        setTitle.setSiteTitle(resp.siteTitle);
                    }
                }
            }
        },
        about: {
            namespaced: true,
            state: {
                loading: false,
                data: "",
            },
            mutations: {
                setLoading(state, payload) {
                    state.loading = payload;
                },
                setData(state, payload) {
                    state.data = payload
                }
            },
            actions: {
                async getAboutData(ctx) {
                    ctx.commit('setLoading', true);
                    const resp = await getAbout();
                    ctx.commit('setData', resp);
                    ctx.commit('setLoading', false)
                    console.log(ctx.state.data);
                }
            }
        },
        project: {
            namespaced: true,
            state: {
                loading: false,
                data: null,
            },
            mutations: {
                setLoading(state, payload) {
                    state.loading = payload;
                },
                setData(state, payload) {
                    state.data = payload;
                }
            },
            actions: {
                async getProjectData(ctx) {
                    if (ctx.state.data) {
                        return;
                    }
                    ctx.commit('setLoading', true);
                    const resp = await getProject();
                    ctx.commit('setData', resp);
                    ctx.commit('setLoading', false);
                }
            }
        },
        message: {
            namespaced: true,
            state: {
                loading: false,
                data: '',
            },
            mutations: {
                setLoading(state, payload) {
                    state.loading = payload;
                },
                setData(state, payload) {
                    state.data = payload;
                }
            },
            actions: {
                async getMessage(ctx) {
                    ctx.commit('setLoading', true);
                    const resp = await getMessage();
                    ctx.commit('setData', resp);
                    ctx.commit('setLoading', false);
                }
            }

        }
    },
    strict: true,
});
export default store;